import { _decorator, color, Color, Component, Label, Node, Sprite } from 'cc';
const { ccclass, property } = _decorator;
import { UIManager } from '../common/UIManager';
import { Natural } from './Natural';

@ccclass('TrainingGround')

export class TrainingGround extends Component {
    // 隐藏显示模块
    @property(Node)
    private training: Node
    @property(Node)
    private trainingQuantity: Node


    @property(Node)
    private tab: Node
    @property(Node)
    private back: Node
    @property(Node)
    private close: Node
    @property(Node)
    private tab1: Node
    @property(Sprite)
    private tabStyle1: Sprite
    @property(Node)
    private tab2: Node
    @property(Sprite)
    private tabStyle2: Sprite
    @property(Node)
    private tab3: Node
    @property(Sprite)
    private tabStyle3: Sprite
    @property(Node)
    private tab4: Node
    @property(Sprite)
    private tabStyle4: Sprite
    @property(Node)
    private tab5: Node
    @property(Sprite)
    private tabStyle5: Sprite
    start() {
        this.training.active = false
        this.trainingQuantity.active = false
        this.back.on(Node.EventType.TOUCH_END, this.onBack, this)
        this.close.on(Node.EventType.TOUCH_END, this.onClose, this)

        this.tab1.on(Node.EventType.TOUCH_END, this.onTab1, this)
        this.tab2.on(Node.EventType.TOUCH_END, this.onTab2, this)
        this.tab3.on(Node.EventType.TOUCH_END, this.onTab3, this)
        this.tab4.on(Node.EventType.TOUCH_END, this.onTab4, this)
        this.tab5.on(Node.EventType.TOUCH_END, this.onTab5, this)

        // let children = this.tab.children
        // console.log(children, "childrenchildrenchildren")
        // let btnArr = ['兵营', '马厩', '兵工厂', '大兵营', '大马厩']

        // for (let i = 0; i < children.length; i++) {
        //     let ass = Natural.tabActive(children[i])
        //     // children[i].getComponent(Natural).tabActive(children[i])
        // }

        this.tabStyle1.color = color(171, 140, 99);


    }
    clickas() {

    }
    onTab1() {
        console.log("你点击了兵营")
        // 点击按钮的颜色
        this.tabStyle1.color = color(171, 140, 99);
        this.tabStyle2.color = color(73, 59, 42)
        this.tabStyle3.color = color(73, 59, 42)
        this.tabStyle4.color = color(73, 59, 42)
        this.tabStyle5.color = color(73, 59, 42)
    }
    onTab2() {
        console.log("你点击了马厩")
        this.tabStyle2.color = color(171, 140, 99);
        this.tabStyle1.color = color(73, 59, 42)
        this.tabStyle3.color = color(73, 59, 42)
        this.tabStyle4.color = color(73, 59, 42)
        this.tabStyle5.color = color(73, 59, 42)
    }
    onTab3() {
        console.log("你点击了兵工厂")

        this.tabStyle3.color = color(171, 140, 99);
        this.tabStyle1.color = color(73, 59, 42)
        this.tabStyle2.color = color(73, 59, 42)
        this.tabStyle4.color = color(73, 59, 42)
        this.tabStyle5.color = color(73, 59, 42)
    }
    onTab4() {
        console.log("你点击了大兵营")
        this.tabStyle4.color = color(171, 140, 99);
        this.tabStyle1.color = color(73, 59, 42)
        this.tabStyle2.color = color(73, 59, 42)
        this.tabStyle3.color = color(73, 59, 42)
        this.tabStyle5.color = color(73, 59, 42)
    }
    onTab5() {
        console.log("你点击了大马厩")
        // Natural.tabActive(4)
        this.tabStyle5.color = color(171, 140, 99);
        this.tabStyle1.color = color(73, 59, 42)
        this.tabStyle2.color = color(73, 59, 42)
        this.tabStyle3.color = color(73, 59, 42)
        this.tabStyle4.color = color(73, 59, 42)
    }

    onBack() {
        UIManager.instance.loadScene('village')
    }
    onClose() {
        UIManager.instance.loadScene('village')

    }

    update(deltaTime: number) {

    }
}


